<template>
	<view :class="isShowMask?'mask':'nomask'">
		<view class="content">
			<image @click="closerZl()" class="closeImg" src="../../static/icon3/gb.png" mode="aspectFill"></image>
			<view class="title">
				还需<text>{{num-count>=0?(num-count):0}}</text>人助力
			</view>
			<view class="instructions">分享好友下载后登录即为1次助力</view>
			<view class="button">
				<view class="button-item" @click="handleShare('WXSceneSession')">
					<image src="../../static/icon3/0000000002.png" mode="aspectFill"></image>
					<text>微信好友</text>
				</view>
				<view class="button-item" @click="handleShare('WXSenceTimeline')">
					<image src="../../static/icon3/000000001.png" mode="aspectFill"></image>
					<text>朋友圈</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			isShowMask:{
				type:Boolean,
				default:true
			},
		},
		data() {
			return {
				num:3,
				count: 0,
			}
		},
		methods:{
			closerZl(){
				this.$emit('closerZl')
			},
			//分享
			handleShare(scene) {
				console.log('分享场景', scene)
				uni.share({
					provider: "weixin",
					scene: scene,
					type: 0,
					href: 'http://zhuli.linglinggong.net/#/?id=' + uni
						.getStorageSync('userId'),
					title: "帮我助力解禁",
					summary: "助力好友拿现金，上线就领26元红包！！",
					imageUrl: 'http://images.linglinggong.net/FovByz9oRrP4wIPyrtiJJf-0cxwB',
					success: function(res) {
						// console.log("success:" + JSON.stringify(res));
					},
					fail: function(err) {
						console.log("fail:" + JSON.stringify(err));
						uni.showToast({
							title: '未登陆',
							icon: 'none'
						})
					}
				});
				this.closerZl()
			},
		},
		beforeMount() {
			if(uni.getStorageSync('FengjinItem')){
				this.num=uni.getStorageSync('FengjinItem').scheduleNumber
				this.count=uni.getStorageSync('FengjinItem').schedule
			}
		},
	}
</script>

<style lang="less" scoped>
	.mask {
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		background-color: rgba(0,0,0,.6);
	}
	.nomask {
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		background-color: rgba(0,0,0,0);
	}
	.content {
		width: 750rpx;
		height: 499rpx;
		background: #F2F2F2;
		position: absolute;
		bottom: 0;
		border-radius:24rpx 24rpx 0 0 ;
	}
	.closeImg {
		width: 28rpx;
		height: 28rpx;
		margin: 30rpx 0 0 30rpx;
	}
	.title {
		text-align: center;
		font-size: 36rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #000000;
		line-height: 36rpx;
		&>text {
			font-size: 52rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #FE4B28;
			line-height: 36rpx;
		}
	}
	.instructions {
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #515151;
		line-height: 32rpx;
		margin: 36rpx 0 80rpx 0;
		text-align: center;
	}
	.button {
		margin: 0 auto;
		width: 369rpx;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}
	.button-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		&>image{
			width: 120rpx;
			height: 120rpx;
		}
		&>text {
			margin-top: 24rpx;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #1A1A1A;
			line-height: 28rpx;
		}
	}
</style>
